<!--
内容：推荐至部门
作者：黄彪
日期： 20170706
-->

<template>
    <div>
        <Modal title="新增职位" v-model="modal8" :mask-closable="false">

            <div class="ivu-form-item">
                <label class="ivu-form-item-label">职位名称</label>
                <div class="ivu-form-item-content">
                    <div class="ivu-input-wrapper ivu-input-type">
                        <i class="ivu-icon ivu-icon-load-c ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                        <input type="text" placeholder="" class="ivu-input"></div>
                </div>
            </div>

            <div class="ivu-form-item">
                <label class="ivu-form-item-label">
                    <span>所属部门</span>
                    <span style="float: right;color:blue;">+所属部门</span>
                </label>
                <div class="ivu-form-item-content">
                    <div class="ivu-input-wrapper ivu-input-type">
                        <i class="ivu-icon ivu-icon-load-c ivu-load-loop ivu-input-icon ivu-input-icon-validate"></i>
                        <input type="text" placeholder="" class="ivu-input"></div>
                </div>
            </div>


            <div>
                <div class="float_right width_150px">
                    <Button type="primary" class="margin_right_15">确定</Button>
                    <Button type="primary" class="margin_right_15">取消</Button>
                </div>
                <div class="margin_right_150">
                    <input type="text" placeholder="" class="ivu-input">
                </div>
            </div>

            <div class="margin_top_15">
                <input type="text" placeholder="产品与设计部门" class="ivu-input">
            </div>

            <div slot="footer" class="text_center">
                <Button type="primary" class="margin_right_15">确定</Button>
                <Button type="primary" class="margin_right_15">取消</Button>
            </div>
        </Modal>

    </div>
</template>

<script>
    //  富文本编辑器
    import VueQuillEditor from 'vue-quill-editor'
    // 引用数据字典
    import {salaryRange} from "../src/config/dataDictionary"

    export default {
        components: {
            VueQuillEditor
        },
        data: function() {
            return {
                modal8:true,
                model12:[],
                formCustom:{},
                // 富文本编辑器
                editorOption: {
                    // some quill options
                },
                content:"<h2>I am Example 1</h2>",
                model1:"beijing",
                // 多选配置
                phone:"apple",
                // 薪资范围
                salaryRange:salaryRange,
                // 下拉列表数据
                cityList: [
                    {
                        value: 'beijing',
                        label: '北京市'
                    },
                    {
                        value: 'shanghai',
                        label: '上海市'
                    },
                    {
                        value: 'shenzhen',
                        label: '深圳市'
                    },
                    {
                        value: 'hangzhou',
                        label: '杭州市'
                    },
                    {
                        value: 'nanjing',
                        label: '南京市'
                    },
                    {
                        value: 'chongqing',
                        label: '重庆市'
                    }
                ]
            }
        },
        methods: {
            onEditorBlur(editor) {
                console.log('editor blur!', editor)
            },
            onEditorFocus(editor) {
                console.log('editor focus!', editor)
            },
            onEditorReady(editor) {
                console.log('editor ready!', editor)
            }
        },
        computed: {
            editor() {
                return this.$refs.myTextEditor.quill
            }
        }
    }
</script>

<style scoped lang="scss">

    .postJob{
        min-width: 900px;
        max-width: 1200px;



        .ivu-form-item{
            padding: 0 12px;
            .ivu-form-item-label{
                line-height: 28px;
            }
            .necessary{
                color: #EEB03B;
                margin-left: 3px;
                line-height: 14px;
                font-size: 14px;
            }
        }
    }

</style>
